.view-left {
    float: left;
    width: 320px;
    border-right: 1px solid #b2b2b2;
}
.page-content{background:#fff;}
.list-block{margin:0px;margin-top: -1px;}
.list-block ul{border-bottom: 1px solid #eee}
.list-block ul  li{border-bottom:1px solid #eee;margin-left: 10px;}
.list-block ul li:last-child{border-bottom:0px;}
.list-block .item-inner{border-bottom: 0px;}
.list-block .item-content{padding-left: 0px;}
.datetimes{font-size:13px;}
.list-block.media-list .item-media img{border-radius:5px;}
.item-subtitle{color:#ccc;}
.view-main {
    width: -webkit-calc(100%);
    width: -moz-calc(100%);
    width: -ms-calc(100%);
    width: calc(100%);
}
.message-received.message-pic .message-text {
    background: #e5e5ea;
}
.message-sent.message-pic .message-text {
    background: #e5e5ea;
}
.message-received.message-with-avatar .message-text {
    margin-left: 35px;
}
.message-sent.message-with-avatar .message-text {
    margin-right: 35px;
}

.message-received.message-with-avatar .message-name,.message-sent.message-with-avatar .message-name{
    margin-left: 0;
    position:absolute;
    left: 0;width: 100%;
    top:25px;
}
.message-received,.message-sent{margin-bottom: 20px;}
@media (max-width: 768px) {
    .view-left {
        width: 160px;
    }
    .view-main {
        width: -webkit-calc(100%);
        width: -moz-calc(100%);
        width: -ms-calc(100%);
        width: calc(100%);
    }
}
@media (max-width: 480px) {
    .view-left {
        display: none;
    }
    .view-main {
        width: 100%;
    }
}